<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <input type="file" id='upload'>
    <input type="file" id='upload2'>
    <input type="file" id='upload3'>
    <div></div>
    <p></p>
    <script>
        let upload = document.querySelector('#upload')
        let upload2 = document.querySelector('#upload2')
        let upload3 = document.querySelector('#upload3')
        upload.onchange = function(){
            let file = this.files[0];   
            let freader = new FileReader();
            freader.readAsText(file);

            freader.onload = function(){
                let style = document.createElement('style');
                style.innerHTML = freader.result;
                document.querySelector('head').appendChild(style)
            }

        }
        upload2.onchange = function(){
            let file = this.files[0];   
            let freader = new FileReader();
            freader.readAsText(file);

            freader.onload = function(){
                let style = document.createElement('script');
                style.innerHTML = freader.result;
                document.querySelector('head').appendChild(style)
            }

        }
        upload3.onchange = function(){
            let file = this.files[0];   
            let freader = new FileReader();
            freader.readAsDataURL(file);

            freader.onloadstart = function(){
               document.querySelector('p').innerHTML = '加载中。。'
            }
            freader.onload = function(){
                let img = document.createElement('img');
                img.src = freader.result;
                img.style.width = '320px';
                window.document.body.appendChild(img)
            }
            freader.onloadend = function(){
               document.querySelector('p').innerHTML = '加载成功'
            }

        }
    </script>
</body>
</html>